<template>
	<view class="page-container">
		<u-navbar autoBack title="设置" bgColor="#ECF6EA" fixed placeholder safeAreaInsetTop></u-navbar>

		<view class="container">
			<view class="edit-item" v-for="(item,index) in editData" :key="index" @click="gonavigate(item.url)">
				<view class="item-left">{{item.name}}</view>
				<u-icon name="arrow-rightward" size="20"></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 编辑数据
				editData: [{
						name: '头像',
						url: 'myInfo'
					},
					{
						name: '昵称',
						url: '/pages/setting/editUserName'
					},
					{
						name: '性别',
						url: 'myInfo'
					},
					{
						name: '出生年月',
						url: 'myInfo'
					},
					{
						name: '个性签名',
						url: 'myInfo'
					},
					{
						name: '我的圈口',
						url: 'myInfo'
					}
				]
			}
		},
		methods: {
			// 跳转页面
			gonavigate(pageUrl) {
				uni.navigateTo({
					//保留当前页面，跳转到应用内的某个页面
					url: pageUrl
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page-container {
		.container {
			.edit-item {
				display: flex;
				align-items: center;
				justify-content: space-between;
				background-color: $gs-jpBg;
				margin: $uni-spacing-col-sm 0;
				padding: $uni-spacing-col-lg $uni-spacing-row-lg;
			}
		}
	}
</style>